<?php
	echo $this->Html->css('elastislide');
	echo $this->Html->css('custom');
?>
<script src="<?php echo $this->webroot; ?>js/modernizr.custom.17475.js"></script>
<script type="text/javascript" src="<?php echo $this->webroot; ?>js/jquerypp.custom.js"></script>
<script type="text/javascript" src="<?php echo $this->webroot; ?>js/jquery.elastislide.js"></script>

<ul id="carousel" class="elastislide-list">
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/1.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/2.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/3.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/4.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/5.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/6.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/7.jpg"/></a></li>
    <li><a href="#"><img src="<?php echo $this->webroot; ?>img/carousel/8.jpg"/></a></li>
</ul>
<script type="text/javascript">		
	$('#carousel').elastislide();
	$.Elastislide.defaults = {
		    speed : 500,
		    easing : 'ease-in-out',
		    minItems : 3,
		    onClick : function( el, position, evt ) { return false; },
		    onReady : function() { return false; },
		    onBeforeSlide : function() { return false; },
		    onAfterSlide : function() { return false; }
		};
</script>